<template>
	<div>
		<el-container style="height: 500px; border: 1px solid #eee">
		  <el-header style="text-align: right; font-size: 12px">
		  </el-header>
		  <el-container>
		
		    <el-aside width="200px" style="margin-left: 20px;">
		      <el-menu>
		        <router-link class="a-setting" to="/">
		          <el-menu-item index="1"><i class="el-icon-s-home"></i>首页</el-menu-item>
		        </router-link>
		        <router-link class="a-setting" to="/mineimg">
		          <el-menu-item index="2"><i class="el-icon-user"></i>我的头像</el-menu-item>
		        </router-link>
		        <router-link class="a-setting" to="/minemsg">
		          <el-menu-item index="3"><i class="el-icon-bell"></i>我的信息</el-menu-item>
		        </router-link>
		        <router-link class="a-setting" to="/user">
		          <el-menu-item index="4"><i class="el-icon-house"></i>个人空间 ></el-menu-item>
		        </router-link>
		      </el-menu>
		
		    </el-aside>
		
		    <el-main style="margin-top: 0px;margin-right: 50px;">
		
		      <el-card>
		        <router-view></router-view>
		      </el-card>
		
		    </el-main>
		  </el-container>
		</el-container>
	</div>
</template>

<script>
	export default{
		name: 'setting',
		data() {
		  // const item = {
		  //   date: '2016-05-02',
		  //   name: '王小虎',
		  //   address: '上海市普陀区金沙江路 1518 弄'
		  // };
		  return {
		    tabPosition: 'left',
		    // tableData: Array(20).fill(item)
		
		  };
		},
		methods: {
		  handleOpen(key, keyPath) {
		    console.log(key, keyPath);
		  },
		  handleClose(key, keyPath) {
		    console.log(key, keyPath);
		  }
		}
	}
</script>

<style>
	.a-setting {
	  color: gray;
	}
	
	.left-nav {
	  background-color: #42B983;
	}
	
	.el-header {
	  background-color: #B3C0D1;
	  color: #333;
	  line-height: 60px;
	}
	
	.el-aside {
	  color: #333;
	}
</style>
